<link  type="text/css" href="https://www.layuicdn.com/layui/css/layui.css" rel="stylesheet"/>
<script type="text/javascript" src="https://www.layuicdn.com/layui/layui.js"></script>
<script type="text/javascript">
    layui.config({
      dir: 'https://www.layuicdn.com/layui/' 
      ,version: false 
      ,debug: false 
      ,base: '' 
    });
</script>



<!-- 框架的组件文档 "https://www.layui.com/doc/element/panel.html" -->
<div class="layui-collapse" lay-accordion style="font-size: 14px">
	<div class="layui-colla-item">
		<h2 class="layui-colla-title">杜甫</h2>
		<div class="layui-colla-content layui-show">

			内容区域
		</div>
	</div>
	<div class="layui-colla-item">
		<h2 class="layui-colla-title">李清照</h2>
		<div class="layui-colla-content ">

			内容区域
		</div>
	</div>
	<div class="layui-colla-item">
		<h2 class="layui-colla-title">鲁迅</h2>
		<div class="layui-colla-content ">

			内容区域
		</div>
	</div>
</div>

<script type="text/javascript">
	//注意：折叠面板 依赖 element 模块，否则无法进行功能性操作
	layui.use('element', function(){
		var element = layui.element;

	  //…
	});
	//每一项点击事件监听
	$('.layui-colla-title').click(function(){
		console.log($(this).text());
	})
</script>